import Icon from 'components/Icon'
import AlbumCard from "./AlbumCard";
import s from '../index.module.scss'

export default function JSCore() {
  return (
    <AlbumCard
      title='JavaScript 核心进阶'
      description='只给你地道的前端进阶思维'
      _id='b787f7c366345ff1002a1b8d5851a5d7'
    >
      <div id={s.middle}>
        <div className={s.iwrapper}>
          <Icon name='rect_56' size={26} />
          <div className={s.text}>知识体系</div>
        </div>
        <div className={s.iwrapper}>
          <Icon name='rect_161' size={26} />
          <div className={s.text}>六大模块</div>
        </div>
        <div className={s.iwrapper}>
          <Icon name='rect_74' size={26} />
          <div className={s.text}>深入浅出</div>
        </div>
      </div>

      <div className={s.bottom}>
        <div id={s.dot}>
          <Icon name={'check-circle'} size={16} color='#171717' style={{fontWeight: 'bold'}} />
          <div className={s.dot_text}>围绕事件循环展开体系</div>
        </div>
        <div id={s.dot}>
          <Icon name={'check-circle'} size={18} color='#171717' style={{fontWeight: 'bold'}} />
          <div className={s.dot_text}>{`基础脉络：内存 -> 数据结构 -> 设计模式`}</div>
        </div>
        <div id={s.dot}>
          <Icon name={'check-circle'} size={20} color='#171717' style={{fontWeight: 'bold'}} />
          <div className={s.dot_text}>以模块化驱动项目架构</div>
        </div>
      </div>
    </AlbumCard>
  )
}
